<template>
	<div id="app">
		<el-container>
			<el-header>
				<el-menu :default-active="activeIndex" router="true" class="el-menu-demo" mode="horizontal"
					@select="handleSelect">
					<el-menu-item v-show="have" @click="zhuce()" style="float: right;">注册</el-menu-item>
					<el-menu-item v-show="have" @click="login()" style="float: right;">登录</el-menu-item>
					<!-- <img v-show="have" src="../assets/111.jpg" style="float: right;" @click="login()">
					<img v-show="have" src="../assets/111.jpg" style="float: right;" @click="zhuce()"> -->
					<img v-show="so" src="../assets/user.jpg" style="float: right;">
					<el-menu-item index='/Head'>首页</el-menu-item>
					<el-menu-item index="/Gg">公告</el-menu-item>
					<el-menu-item index="/opinion">好书推荐</el-menu-item>
					<el-menu-item index="/Pcenter">个人中心</el-menu-item>
					</el-submenu>
				</el-menu>
			</el-header>
			<el-main>
				<router-view></router-view>
			</el-main>	
		</el-container>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				so:false,
				name:'',
				have:true,
				itemimg: ["../assets/111.jpg"],
				options: [{
					value: '选项1',
					label: '历史'
				}, {
					value: '选项2',
					label: '科幻'
				}, {
					value: '选项3',
					label: '儿童'
				}, {
					value: '选项4',
					label: '青春'
				}, {
					value: '选项5',
					label: '科普'
				}],
				value: '',
				input: '',
				NavState: '',
				addialogVisible: false

			}
		},
		methods: {
			saveNavState(data) {
				console.log(data);
				window.sessionStorage.setItem('data', data);
				this.NavState = data;
			},
			login() {
				this.$router.push('/login');
			},
			zhuce() {
				this.$router.push('/zhuce');
			}
		},
		created(){
			console.log(sessionStorage.getItem("username"));
			if(sessionStorage.getItem("username")==null){
				
				
			}else{
				this.have=false;
				this.so=true;
				this.name=sessionStorage.getItem("name");
			}
		}
	}
</script>

<style scoped="scoped">
	.el-header {
		height: 30px;

	}

	.el-footer {
		height: 30px;
		background-color: #000000;
	}

	.el-header img {
		height: 60px;
	}

	.el-carousel__item h3 {
		color: #475669;
		font-size: 18px;
		opacity: 0.75;
		line-height: 300px;
		margin: 0;
	}

	.el-carousel__item:nth-child(2n) {
		background-color: #99a9bf;
	}

	.el-carousel__item:nth-child(2n+1) {
		background-color: #d3dce6;
	}
</style>
